<!-- 我是收藏的活动 -->
<template>
	<color-header></color-header>
	<uni-nav-bar title="已收藏的活动" left-icon="left" fixed clear-float status-bar :border="false"
		background-color="linear-gradient(to right, #CDE0F8, #C3F0F0, #DFF8F0)" 
		@clickLeft="$navTo('',{}, 'navigateBack')"></uni-nav-bar>	
	<view class="activity-list" v-if="activity.data != false">
		<activity-list v-for="(item, index) in activity.data" :key="index" :info="item"></activity-list>
		<uni-load-more v-if="activity.data.length >= 7" :status="loadStatus"></uni-load-more>
	</view>
	<empty-status v-else note="当前没有收藏的活动" src="/static/images/like-empty.png"></empty-status>
</template>

<script>
	export default {
		data() {
			return {
				loadStatus: 'more',
				activity: {
					data: [],
					page: 1,
					hasMore: false
				},
			}
		},
		onLoad() {
			this.getlikedActivity()
		},
		// 刷新
		onPullDownRefresh() {
			uni.showLoading({
				mask: true
			})
			this.getlikedActivity(true)
			setTimeout(() => {
				uni.hideLoading()
				uni.stopPullDownRefresh()
			}, 1000)
		},
		// 触底加载
		onReachBottom() {
			if (this.activity.hasMore) {
				this.loadStatus = 'loading'
				this.activity.page += 1
				this.getlikedActivity()
			} else {
				this.loadStatus = 'noMore'
			}
		},
		methods: {
			async getlikedActivity(refresh = false) {
				const res = await this.$request.get('/api/user/collect_lists', {page: this.activity.page})
				this.loadStatus = 'more'
				if (res.code == 200) {
					this.activity.hasMore = res.data.has_more_page
					const list = res.data?.lists || []
					if (refresh) {
						this.activity.data = list
						this.activity.page = 1
					} else {
						this.activity.data = this.activity.data.concat(list)
					}
					
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.activity-list {
		padding: 24rpx 30rpx;
	}
</style>